iOS অ্যাপ্লিকেশন ডেভেলপমেন্টে Navigation এবং Multi-View Applications হলো গুরুত্বপূর্ণ উপাদান, যা ব্যবহারকারীদের অ্যাপ্লিকেশনের বিভিন্ন ভিউয়ের মধ্যে নেভিগেট করতে সাহায্য করে। UIKit ফ্রেমওয়ার্ক এ iOS অ্যাপ্লিকেশনে ভিউ কন্ট্রোলারের মধ্যে নেভিগেট করতে এবং একটি মাল্টি-ভিউ অ্যাপ তৈরি করতে বিভিন্ন টুল এবং প্যাটার্ন প্রদান করে।
Navigation এবং Multi-View Applications কীভাবে কাজ করে
iOS এ নেভিগেশন সাধারণত UINavigationController, UITabBarController, এবং Modal Presentation ব্যবহার করে করা হয়। নিচে প্রতিটি পদ্ধতির বিস্তারিত আলোচনা করা হলো:
১. UINavigationController
UINavigationController হলো একটি কন্টেইনার ভিউ কন্ট্রোলার, যা একটি স্ট্যাকের মতো কাজ করে। এটি একাধিক ভিউ কন্ট্রোলারকে স্ট্যাক আকারে রাখে এবং পুশ এবং পপ অপারেশন (নতুন ভিউ যোগ করা এবং বর্তমান ভিউ সরানো) ব্যবহার করে নেভিগেশন পরিচালনা করে।
UINavigationController ব্যবহার করে নেভিগেশন
নিচে একটি উদাহরণ দেওয়া হলো যেখানে UINavigationController ব্যবহার করে দুইটি ভিউ কন্ট্রোলারের মধ্যে নেভিগেট করা হচ্ছে।
Step 1: প্রথমে Xcode এ একটি নতুন প্রজেক্ট তৈরি করুন এবং ViewController.swift এ দুটি ভিউ কন্ট্রোলার তৈরি করুন:
import UIKit
class FirstViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .white
title = "First View"
let button = UIButton(type: .system)
button.setTitle("Go to Second View", for: .normal)
button.translatesAutoresizingMaskIntoConstraints = false
button.addTarget(self, action: #selector(navigateToSecondView), for: .touchUpInside)
view.addSubview(button)
NSLayoutConstraint.activate([
button.centerXAnchor.constraint(equalTo: view.centerXAnchor),
button.centerYAnchor.constraint(equalTo: view.centerYAnchor)
])
}
@objc func navigateToSecondView() {
let secondVC = SecondViewController()
navigationController?.pushViewController(secondVC, animated: true)
}
}
class SecondViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .lightGray
title = "Second View"
}
}
Step 2: AppDelegate.swift বা SceneDelegate.swift এ UINavigationController সেটআপ করুন:
import UIKit
class SceneDelegate: UIResponder, UIWindowSceneDelegate {
var window: UIWindow?
func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
guard let windowScene = (scene as? UIWindowScene) else { return }
let window = UIWindow(windowScene: windowScene)
let firstVC = FirstViewController()
let navigationController = UINavigationController(rootViewController: firstVC)
window.rootViewController = navigationController
self.window = window
window.makeKeyAndVisible()
}
}
ব্যাখ্যা:
- FirstViewController: একটি বাটন ব্যবহার করে আমরা
SecondViewControllerতে নেভিগেট করছি।navigationController?.pushViewController()মেথড ব্যবহার করে নতুন ভিউ কন্ট্রোলার স্ট্যাক এ যুক্ত করছি। - SecondViewController: এটি একটি সাধারণ ভিউ কন্ট্রোলার, যা স্ট্যাকের দ্বিতীয় আইটেম হিসেবে প্রদর্শিত হবে।
- UINavigationController সেটআপ:
SceneDelegateএUINavigationControllerতৈরি করা হয়েছে এবং সেটিকে রুট ভিউ কন্ট্রোলার হিসেবে সেট করা হয়েছে।
২. UITabBarController
UITabBarController হলো একটি কন্টেইনার ভিউ কন্ট্রোলার যা একাধিক ভিউ কন্ট্রোলারকে ট্যাব আকারে প্রদর্শন করে। এটি সাধারণত এমন অ্যাপ্লিকেশনগুলোতে ব্যবহৃত হয় যেগুলোতে একাধিক বিভাগ থাকে, যেমন: স্যোশাল মিডিয়া বা ই-কমার্স অ্যাপ।
UITabBarController ব্যবহার করে Multi-View Application তৈরি
নিচে একটি উদাহরণ দেওয়া হলো যেখানে দুইটি ভিউ কন্ট্রোলার একটি UITabBarController এর মধ্যে যুক্ত করা হচ্ছে।
import UIKit
class FirstViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .white
title = "Home"
tabBarItem = UITabBarItem(tabBarSystemItem: .favorites, tag: 0)
}
}
class SecondViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .lightGray
title = "Settings"
tabBarItem = UITabBarItem(tabBarSystemItem: .more, tag: 1)
}
}
class SceneDelegate: UIResponder, UIWindowSceneDelegate {
var window: UIWindow?
func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
guard let windowScene = (scene as? UIWindowScene) else { return }
let window = UIWindow(windowScene: windowScene)
let firstVC = FirstViewController()
let secondVC = SecondViewController()
let tabBarController = UITabBarController()
tabBarController.viewControllers = [firstVC, secondVC]
window.rootViewController = tabBarController
self.window = window
window.makeKeyAndVisible()
}
}
ব্যাখ্যা:
- FirstViewController এবং SecondViewController: দুটি ভিউ কন্ট্রোলার তৈরি করা হয়েছে এবং তাদের ট্যাব আইটেম সেট করা হয়েছে।
- UITabBarController: আমরা একটি
UITabBarControllerতৈরি করেছি এবং এরviewControllersপ্রোপার্টিতে দুটি ভিউ কন্ট্রোলার অ্যাসাইন করেছি।
৩. Modal Presentation
Modal Presentation হলো একটি ভিউ কন্ট্রোলারকে বর্তমান ভিউর উপর পুরোপুরি বা আংশিকভাবে প্রদর্শন করার পদ্ধতি। এটি সাধারণত এলার্ট, ফর্ম, বা ডিটেইল ভিউ প্রদর্শনের জন্য ব্যবহৃত হয়।
Modal Presentation এর উদাহরণ
import UIKit
class FirstViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .white
title = "Main View"
let button = UIButton(type: .system)
button.setTitle("Present Modal View", for: .normal)
button.translatesAutoresizingMaskIntoConstraints = false
button.addTarget(self, action: #selector(presentModalView), for: .touchUpInside)
view.addSubview(button)
NSLayoutConstraint.activate([
button.centerXAnchor.constraint(equalTo: view.centerXAnchor),
button.centerYAnchor.constraint(equalTo: view.centerYAnchor)
])
}
@objc func presentModalView() {
let modalVC = ModalViewController()
modalVC.modalPresentationStyle = .fullScreen // অথবা .automatic, .overFullScreen ইত্যাদি
present(modalVC, animated: true, completion: nil)
}
}
class ModalViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .systemGreen
title = "Modal View"
let dismissButton = UIButton(type: .system)
dismissButton.setTitle("Dismiss", for: .normal)
dismissButton.translatesAutoresizingMaskIntoConstraints = false
dismissButton.addTarget(self, action: #selector(dismissView), for: .touchUpInside)
view.addSubview(dismissButton)
NSLayoutConstraint.activate([
dismissButton.centerXAnchor.constraint(equalTo: view.centerXAnchor),
dismissButton.centerYAnchor.constraint(equalTo: view.centerYAnchor)
])
}
@objc func dismissView() {
dismiss(animated: true, completion: nil)
}
}
ব্যাখ্যা:
- ModalViewController: আমরা একটি ভিউ কন্ট্রোলার তৈরি করেছি, যা মডাল হিসেবে প্রেজেন্ট হবে।
- Modal Presentation Style:
modalPresentationStyleসেট করে মডাল ভিউ কন্ট্রোলারকে কিভাবে প্রদর্শিত হবে তা নির্ধারণ করা হয়েছে (যেমন:.fullScreenবা.automatic)। - Dismiss: মডাল ভিউ থেকে বের হতে
dismissমেথড ব্যবহার করা হয়েছে।
Navigation এবং Multi-View Applications এর সেরা চর্চা
- UINavigationController ব্যবহার করুন: অ্যাপ্লিকেশন স্ট্যাকভিত্তিক নেভিগেশনের জন্য এটি সবচেয়ে ভালো প্যাটার্ন।
- UITabBarController ব্যবহার করুন: অ্যাপ্লিকেশনে একাধিক বিভাগ বা ফিচার থাকলে এটি ব্যবহার করে সেগুলো সহজে সংগঠিত করুন।
- Modal Presentation: ডিটেইল ভিউ বা এলার্ট প্রদর্শনের জন্য এটি ব্যবহার করুন এবং যথাযথ প্রেজেন্টেশন স্টাইল (যেমন:
.overFullScreen) নির্ধারণ করুন। - Storyboard এবং Code ব্যবহার মিক্স করুন: যদি অ্যাপ্লিকেশন বড় হয়, তবে স্টোরিবোর্ড এবং কোড উভয় পদ্ধতি মিক্স করে ব্যবহার করা সুবিধাজনক।
উপসংহার
iOS অ্যাপ্লিকেশনে Navigation এবং Multi-View Applications তৈরি করতে UINavigationController, UITabBarController, এবং Modal Presentation অত্যন্ত কার্যকরী টুলস। এই প্যাটার্নগুলো ব্যবহার করে আমরা সহজেই একটি সুগঠিত এবং ইন্টারেক্টিভ ইউজার ইন্টারফেস তৈরি করতে পারি।
UINavigationController এর ব্যবহার
UINavigationController হলো UIKit-এর একটি কম্পোনেন্ট যা iOS অ্যাপে হায়ারারক্যাল নেভিগেশন পরিচালনা করতে ব্যবহৃত হয়। এটি ভিউ কন্ট্রোলারগুলোর মধ্যে স্ট্যাক ভিত্তিক নেভিগেশন প্রদান করে, যা ব্যবহারকারীকে একটি ভিউ থেকে অন্য ভিউতে যাওয়ার এবং সহজে ব্যাক বা ফরওয়ার্ড নেভিগেশন করার সুযোগ দেয়। সাধারণত, UINavigationController টপে একটি নেভিগেশন বার প্রদর্শন করে, যা বর্তমান স্ক্রিনের শিরোনাম, ব্যাক বোতাম, এবং অন্যান্য অপশন দেখানোর জন্য ব্যবহৃত হয়।
UINavigationController কেন ব্যবহার করবেন?
- স্ট্যাক ভিত্তিক নেভিগেশন: এটি ভিউ কন্ট্রোলারগুলোকে স্ট্যাকের মতো পরিচালনা করে। একটি নতুন ভিউ কন্ট্রোলার পুশ করার সময় এটি স্ট্যাকের শীর্ষে যোগ হয়, এবং ব্যাক করলে এটি পপ হয়।
- নেভিগেশন বার: প্রতিটি স্ক্রিনে শিরোনাম, ব্যাক বোতাম, এবং কাস্টম আইটেম দেখানোর সুযোগ দেয়।
- ইউজার ফ্রেন্ডলি নেভিগেশন: ব্যবহারকারী সহজেই ব্যাক এবং ফরওয়ার্ড নেভিগেশন করতে পারে।
- মাল্টি-ভিউ অ্যাপ্লিকেশন: জটিল মাল্টি-ভিউ অ্যাপ্লিকেশন যেমন ফাইল ম্যানেজার, সেটিংস অ্যাপ ইত্যাদি তৈরি করতে কার্যকর।
UINavigationController কিভাবে কাজ করে?
UINavigationController একটি root view controller থেকে শুরু হয় এবং পরবর্তীতে নতুন ভিউ কন্ট্রোলারগুলোকে স্ট্যাকের উপর পুশ করা হয়। প্রতিবার যখন একটি ভিউ কন্ট্রোলার পুশ করা হয়, তখন এটি UINavigationController-এর নেভিগেশন স্ট্যাকের শীর্ষে যোগ হয়। ব্যাক করলে (ব্যাক বোতাম ট্যাপ করে বা প্রোগ্রাম্যাটিক্যালি) এটি স্ট্যাক থেকে সরিয়ে ফেলা হয় এবং পূর্বের ভিউ কন্ট্রোলারে ফিরে যায়।
UINavigationController এর ব্যবহার:
1. Storyboard-এর মাধ্যমে UINavigationController সেটআপ করা:
- Step 1: Xcode-এর Storyboard-এ একটি ভিউ কন্ট্রোলার যোগ করুন, যা আপনার Root View Controller হিসেবে কাজ করবে।
- Step 2: এই ভিউ কন্ট্রোলারকে সিলেক্ট করুন এবং Editor > Embed In > Navigation Controller নির্বাচন করুন। এটি আপনার ভিউ কন্ট্রোলারকে UINavigationController-এর সাথে সংযুক্ত করবে।
- Step 3: এখন আপনার অ্যাপের নেভিগেশন সেটআপ হয়ে গেছে, এবং আপনি নতুন ভিউ কন্ট্রোলার পুশ করতে পারবেন।
2. প্রোগ্রাম্যাটিক্যালি UINavigationController ব্যবহার করা:
// Root view controller তৈরি
let rootViewController = ViewController()
// UINavigationController তৈরি এবং রুট ভিউ কন্ট্রোলার সেট করা
let navigationController = UINavigationController(rootViewController: rootViewController)
// উইন্ডোর রুট ভিউ কন্ট্রোলার হিসেবে সেট করা
window?.rootViewController = navigationController
window?.makeKeyAndVisible()
View Controller পুশ করা এবং পপ করা:
1. View Controller পুশ করা:
নতুন ভিউ কন্ট্রোলার পুশ করার জন্য pushViewController(_:animated:) মেথড ব্যবহার করা হয়। এটি স্ট্যাকের শীর্ষে নতুন ভিউ কন্ট্রোলার যোগ করে।
let detailViewController = DetailViewController()
navigationController?.pushViewController(detailViewController, animated: true)
2. View Controller পপ করা:
বর্তমান ভিউ কন্ট্রোলার পপ করার জন্য popViewController(animated:) মেথড ব্যবহার করা হয়। এটি স্ট্যাক থেকে বর্তমান ভিউ কন্ট্রোলার সরিয়ে পূর্বের ভিউ কন্ট্রোলারে ফিরে যায়।
navigationController?.popViewController(animated: true)
UINavigationController এর কাস্টমাইজেশন:
নেভিগেশন বার কাস্টমাইজ করা:
- আপনি UINavigationBar-এর ব্যাকগ্রাউন্ড রঙ, টাইটেল স্টাইল, এবং ব্যাক বোতাম কাস্টমাইজ করতে পারেন।
নেভিগেশন বার লুকানো বা প্রদর্শন করা:
আপনি চাইলে UINavigationBar লুকাতে বা প্রদর্শন করতে পারেন:
navigationController?.setNavigationBarHidden(true, animated: true)
ব্যাক বোতাম কাস্টমাইজ করা:
আপনি কাস্টম ব্যাক বোতাম যোগ করতে পারেন:
let backButton = UIBarButtonItem(title: "Back", style: .plain, target: self, action: #selector(backTapped))
navigationItem.leftBarButtonItem = backButton
@objc func backTapped() {
navigationController?.popViewController(animated: true)
}
UINavigationController এর অন্যান্য গুরুত্বপূর্ণ ফিচার:
উইন্ডো টাইটেল সেট করা:
- আপনি প্রতিটি ভিউ কন্ট্রোলারের শিরোনাম সেট করতে পারেন, যা UINavigationBar-এ প্রদর্শিত হবে।
Navigation Bar-এর Right এবং Left Bar Buttons:
- আপনি কাস্টম বোতাম বা অ্যাকশন যোগ করতে পারেন UINavigationBar-এর ডান বা বাম পাশে।
Swipe Back Gesture:
- UINavigationController ডিফল্টভাবে Swipe to Go Back জেসচার সমর্থন করে, যা ব্যবহারকারীর অভিজ্ঞতাকে আরও ইন্টারঅ্যাকটিভ করে তোলে।
উদাহরণ:
একটি সাধারণ উদাহরণ যেখানে UINavigationController ব্যবহার করে একটি নেভিগেশন সেটআপ করা হয়:
class HomeViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .white
self.title = "Home"
let nextButton = UIButton(type: .system)
nextButton.setTitle("Go to Details", for: .normal)
nextButton.addTarget(self, action: #selector(navigateToDetails), for: .touchUpInside)
nextButton.frame = CGRect(x: 100, y: 200, width: 200, height: 50)
view.addSubview(nextButton)
}
@objc func navigateToDetails() {
let detailVC = DetailViewController()
navigationController?.pushViewController(detailVC, animated: true)
}
}
class DetailViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .lightGray
self.title = "Details"
}
}
// AppDelegate বা SceneDelegate এ এটি ব্যবহার করা হবে:
let homeVC = HomeViewController()
let navController = UINavigationController(rootViewController: homeVC)
window?.rootViewController = navController
window?.makeKeyAndVisible()
সারসংক্ষেপ:
- UINavigationController হলো একটি স্ট্যাক ভিত্তিক নেভিগেশন কন্ট্রোলার যা হায়ারারক্যাল নেভিগেশন প্রদান করে।
- এটি একটি নেভিগেশন বার প্রদান করে যা শিরোনাম, ব্যাক বোতাম, এবং অন্যান্য কাস্টম আইটেম দেখায়।
- নতুন ভিউ কন্ট্রোলার পুশ এবং পপ করে অ্যাপ্লিকেশনের ভিউগুলোর মধ্যে সহজে নেভিগেশন করা যায়।
UINavigationController ব্যবহার করে আপনি জটিল নেভিগেশন কাঠামো তৈরি করতে পারেন এবং ব্যবহারকারীর জন্য একটি সিমলেস এবং ইন্টারঅ্যাক্টিভ অ্যাপ্লিকেশন প্রদান করতে পারেন।
Segues এবং View Controllers এর মধ্যে Data Passing iOS ডেভেলপমেন্টে খুবই গুরুত্বপূর্ণ একটি বিষয়। যখন একটি অ্যাপ্লিকেশনে এক ভিউ কন্ট্রোলার থেকে আরেক ভিউ কন্ট্রোলারে নেভিগেট করা হয়, তখন অনেক সময় ডেটা পাস করার প্রয়োজন হয়। এই প্রক্রিয়ায় Segues এবং prepare(for:sender:) মেথড ব্যবহার করা হয়।
Segues কী?
- Segue হলো একটি ট্রানজিশন যা এক ভিউ কন্ট্রোলার থেকে আরেক ভিউ কন্ট্রোলারে নেভিগেট করে। Interface Builder-এ Storyboard-এর মাধ্যমে Segue যুক্ত করা হয়।
- Segue গুলো সাধারণত Show, Modal, এবং Popover এর মতো ভিউ ট্রানজিশনের ধরন সমর্থন করে।
- Segue যুক্ত করার জন্য Control কী ধরে একটি ভিউ কন্ট্রোলার বা UI এলিমেন্ট থেকে আরেকটি ভিউ কন্ট্রোলারে ড্র্যাগ করা হয় এবং একটি Segue তৈরি করা হয়।
Segue-এর মাধ্যমে View Controllers এর মধ্যে Data Passing
prepare(for:sender:) মেথড ব্যবহার করে একটি Segue-এর মাধ্যমে ডেটা পাস করা হয়। এটি স্বয়ংক্রিয়ভাবে কল হয় যখন একটি Segue এক্সিকিউট হয়।
Source View Controller থেকে Destination View Controller-এ ডেটা পাঠাতে prepare(for:sender:) মেথডে ডেস্টিনেশন ভিউ কন্ট্রোলারের একটি রেফারেন্স পাওয়া যায় এবং সেখানে ডেটা সেট করা হয়।
উদাহরণ: Segue-এর মাধ্যমে Data Passing
ধরা যাক, আমাদের একটি FirstViewController আছে যেটি একটি SecondViewController-এ নেভিগেট করছে এবং আমরা ডেটা পাস করতে চাই।
Step ১: Storyboard-এ Segue তৈরি করা
- Storyboard-এ গিয়ে FirstViewController থেকে SecondViewController-এ একটি Segue যুক্ত করুন। এটি Show Segue বা Modal Segue হতে পারে।
- Segue-টির Identifier সেট করুন (যেমন:
"showSecondVC"), যাতে আমরা কোডে এটি চিনতে পারি।
Step ২: prepare(for:sender:) মেথডে ডেটা পাস করা
FirstViewController.swift ফাইলে prepare(for:sender:) মেথড ওভাররাইড করে ডেটা পাস করা যায়:
class FirstViewController: UIViewController {
var dataToPass: String = "Hello from FirstViewController"
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
// Segue আইডেন্টিফায়ার চেক করা
if segue.identifier == "showSecondVC" {
// ডেস্টিনেশন ভিউ কন্ট্রোলারের রেফারেন্স পাওয়া
if let destinationVC = segue.destination as? SecondViewController {
// ডেটা পাস করা
destinationVC.receivedData = dataToPass
}
}
}
}
- এখানে, prepare(for:sender:) মেথডে আমরা চেক করেছি যে Segue-এর identifier
"showSecondVC"কিনা, তারপর আমরা SecondViewController-এ ডেটা পাস করেছি।
Step ৩: ডেস্টিনেশন ভিউ কন্ট্রোলারে ডেটা রিসিভ করা
SecondViewController.swift ফাইলে একটি ভ্যারিয়েবল তৈরি করুন যাতে ডেটা রিসিভ করা যাবে:
class SecondViewController: UIViewController {
var receivedData: String?
override func viewDidLoad() {
super.viewDidLoad()
// ডেটা প্রিন্ট করা বা UI আপডেট করা
if let data = receivedData {
print(data) // Output: Hello from FirstViewController
}
}
}
- এখানে, আমরা একটি receivedData ভ্যারিয়েবল তৈরি করেছি যেখানে প্রথম ভিউ কন্ট্রোলার থেকে পাঠানো ডেটা সংরক্ষিত হবে।
Button বা Cell থেকে Segue Trigger করা (IBAction বা didSelectRowAt ব্যবহার করে)
- IBAction: যদি কোনো বাটন থেকে Segue ট্রিগার করতে চাও, তাহলে সেটি Storyboard-এ Control-drag করে Segue তৈরি করে নিতে পারো।
- didSelectRowAt: যদি একটি UITableView এর কোনো সেল থেকে Segue ট্রিগার করতে হয়, তাহলে didSelectRowAt মেথড ব্যবহার করে performSegue(withIdentifier:sender:) মেথড কল করা যায়:
override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
performSegue(withIdentifier: "showSecondVC", sender: self)
}
Segue ছাড়াও Programmatically Data Passing (Delegates এবং Closures)
- Delegation Pattern: দ্বিতীয় ভিউ কন্ট্রোলার থেকে ডেটা ফেরত পেতে Delegate প্যাটার্ন ব্যবহার করা যায়।
- Closures: ডেটা পাস করার জন্য Closures ব্যবহার করে কলব্যাক তৈরি করা যায়।
উপসংহার
- Segues ব্যবহার করে iOS অ্যাপে ভিউ কন্ট্রোলারগুলোর মধ্যে সহজে ডেটা পাস করা যায়।
- prepare(for:sender:) মেথডে Segue এর identifier ব্যবহার করে ডেস্টিনেশন ভিউ কন্ট্রোলার চিহ্নিত করা এবং ডেটা পাস করা হয়।
- যদি অ্যাপের লজিক আরও ডাইনামিক হয়, তবে Delegates এবং Closures এর মত আরও উন্নত পদ্ধতিও ব্যবহার করা যেতে পারে।
UIKit এ UITabBarController এবং UISplitViewController ব্যবহার করে আমরা iOS অ্যাপ্লিকেশনে একাধিক ভিউ কন্ট্রোলারকে সুসংগঠিত ও সুগঠিতভাবে উপস্থাপন করতে পারি। এই কন্ট্রোলারগুলো সাধারণত বড় অ্যাপ্লিকেশনগুলোতে ব্যবহৃত হয় যেখানে ব্যবহারকারীদের বিভিন্ন বিভাগ বা বৈশিষ্ট্যে দ্রুত নেভিগেট করতে হয়। নিচে প্রতিটি কন্ট্রোলার এবং তাদের ব্যবহারের পদ্ধতি বিস্তারিতভাবে ব্যাখ্যা করা হলো:
১. UITabBarController
UITabBarController হলো একটি কন্টেইনার ভিউ কন্ট্রোলার যা ট্যাব আকারে একাধিক ভিউ কন্ট্রোলারকে প্রদর্শন করে। এটি সাধারণত নেভিগেশন সহজ এবং সংগঠিত করার জন্য ব্যবহৃত হয়। উদাহরণস্বরূপ, সোশ্যাল মিডিয়া অ্যাপ বা ই-কমার্স অ্যাপ যেখানে হোম, সার্চ, প্রোফাইল, নোটিফিকেশন ইত্যাদি বিভাগ থাকে।
UITabBarController ব্যবহার করে অ্যাপ্লিকেশন তৈরি
নিচে একটি উদাহরণ দেওয়া হলো যেখানে দুইটি ভিউ কন্ট্রোলার একটি UITabBarController এর মধ্যে যুক্ত করা হচ্ছে।
import UIKit
class HomeViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .white
title = "Home"
tabBarItem = UITabBarItem(tabBarSystemItem: .favorites, tag: 0)
}
}
class SettingsViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .lightGray
title = "Settings"
tabBarItem = UITabBarItem(tabBarSystemItem: .more, tag: 1)
}
}
class SceneDelegate: UIResponder, UIWindowSceneDelegate {
var window: UIWindow?
func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
guard let windowScene = (scene as? UIWindowScene) else { return }
let window = UIWindow(windowScene: windowScene)
let homeVC = HomeViewController()
let settingsVC = SettingsViewController()
let tabBarController = UITabBarController()
tabBarController.viewControllers = [homeVC, settingsVC]
window.rootViewController = tabBarController
self.window = window
window.makeKeyAndVisible()
}
}
ব্যাখ্যা:
- HomeViewController এবং SettingsViewController: দুটি ভিউ কন্ট্রোলার তৈরি করা হয়েছে এবং তাদের জন্য ট্যাব আইটেম সেট করা হয়েছে (
tabBarSystemItemদিয়ে)। - UITabBarController: আমরা একটি
UITabBarControllerতৈরি করেছি এবং এরviewControllersপ্রোপার্টিতে দুইটি ভিউ কন্ট্রোলার অ্যাসাইন করেছি। - SceneDelegate: UITabBarController কে রুট ভিউ কন্ট্রোলার হিসেবে সেট করা হয়েছে।
২. UISplitViewController
UISplitViewController সাধারণত বড় স্ক্রিনের জন্য (যেমন: iPad) ব্যবহৃত হয় এবং এটি একটি মাস্টার-ডিটেইল (Master-Detail) ইন্টারফেস প্রদান করে। এটি এমন অ্যাপ্লিকেশনগুলোতে ব্যবহৃত হয় যেখানে ডিটেইল কন্টেন্ট প্রদর্শনের জন্য একটি নির্দিষ্ট সেকশন নির্বাচন করা হয়, যেমন: মেইল অ্যাপ।
UISplitViewController ব্যবহার করে অ্যাপ্লিকেশন তৈরি
নিচে একটি উদাহরণ দেওয়া হলো যেখানে একটি UISplitViewController ব্যবহার করে মাস্টার এবং ডিটেইল ভিউ কন্ট্রোলার সেটআপ করা হচ্ছে।
import UIKit
class MasterViewController: UITableViewController {
var items = ["Item 1", "Item 2", "Item 3"]
override func viewDidLoad() {
super.viewDidLoad()
title = "Master"
}
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return items.count
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "Cell") ?? UITableViewCell(style: .default, reuseIdentifier: "Cell")
cell.textLabel?.text = items[indexPath.row]
return cell
}
override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
let detailVC = DetailViewController()
detailVC.itemText = items[indexPath.row]
showDetailViewController(detailVC, sender: self)
}
}
class DetailViewController: UIViewController {
var itemText: String?
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .white
title = "Detail"
let label = UILabel()
label.text = itemText
label.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(label)
NSLayoutConstraint.activate([
label.centerXAnchor.constraint(equalTo: view.centerXAnchor),
label.centerYAnchor.constraint(equalTo: view.centerYAnchor)
])
}
}
class SceneDelegate: UIResponder, UIWindowSceneDelegate {
var window: UIWindow?
func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
guard let windowScene = (scene as? UIWindowScene) else { return }
let window = UIWindow(windowScene: windowScene)
let masterVC = MasterViewController()
let masterNavVC = UINavigationController(rootViewController: masterVC)
let detailVC = DetailViewController()
let detailNavVC = UINavigationController(rootViewController: detailVC)
let splitVC = UISplitViewController(style: .doubleColumn)
splitVC.viewControllers = [masterNavVC, detailNavVC]
window.rootViewController = splitVC
self.window = window
window.makeKeyAndVisible()
}
}
ব্যাখ্যা:
- MasterViewController: একটি টেবিল ভিউ কন্ট্রোলার, যা একটি লিস্ট দেখায়। লিস্টের একটি আইটেম সিলেক্ট করলে এটি
DetailViewControllerএ নেভিগেট করে। - DetailViewController: ডিটেইল ভিউ কন্ট্রোলার, যা সিলেক্ট করা আইটেমের বিস্তারিত প্রদর্শন করে।
- UISplitViewController: আমরা
UISplitViewControllerতৈরি করে মাস্টার এবং ডিটেইল ভিউ কন্ট্রোলারকে এতে যুক্ত করেছি। এটি একটি doubleColumn স্টাইলের UISplitViewController ব্যবহার করছে, যা iPad এর মতো বড় স্ক্রিনে ভালোভাবে কাজ করে। - SceneDelegate: UISplitViewController কে রুট ভিউ কন্ট্রোলার হিসেবে সেট করা হয়েছে।
UITabBarController এবং UISplitViewController ব্যবহারের সেরা চর্চা
- UITabBarController ব্যবহার করুন: অ্যাপ্লিকেশনে একাধিক বিভাগ বা সেকশন থাকলে, যেগুলো স্বাধীনভাবে কাজ করে, সেগুলোকে সংগঠিত করতে UITabBarController ব্যবহার করুন।
- UISplitViewController ব্যবহার করুন: মাস্টার-ডিটেইল লেআউট প্রয়োজন হলে, বিশেষ করে বড় স্ক্রিনের জন্য (যেমন: iPad), UISplitViewController ব্যবহার করা উচিত।
- NavigationController এর সাথে সংযুক্ত করুন: Tab Bar এবং Split View এর ভিউ কন্ট্রোলারগুলোতে নেভিগেশন ব্যবহারের জন্য UINavigationController যুক্ত করুন।
- Adaptive Layout ব্যবহার করুন: UISplitViewController ব্যবহার করে লেআউটকে অ্যাডাপ্টিভ রাখুন যাতে এটি বড় এবং ছোট উভয় স্ক্রিনে সঠিকভাবে কাজ করে।
উপসংহার
UITabBarController এবং UISplitViewController ব্যবহার করে iOS অ্যাপ্লিকেশনে মাল্টি-ভিউ ইন্টারফেস তৈরি করা সহজ এবং কার্যকরী। UITabBarController একটি সরল এবং কার্যকর পদ্ধতি প্রয়োগ করে, যেখানে UISplitViewController বড় স্ক্রিনে মাস্টার-ডিটেইল লেআউট প্রদর্শন করার জন্য আদর্শ। এগুলো ব্যবহারের মাধ্যমে আপনার অ্যাপ্লিকেশনকে আরও সুগঠিত এবং ইন্টারেক্টিভ করে তোলা যায়।
Modal এবং Push Navigation
iOS অ্যাপ্লিকেশন ডেভেলপমেন্টে Modal Navigation এবং Push Navigation হলো দুটি ভিন্ন নেভিগেশন প্যাটার্ন, যা ভিউ কন্ট্রোলারগুলোর মধ্যে ইন্টারঅ্যাকটিভিটি এবং নেভিগেশন নিশ্চিত করে। UINavigationController ব্যবহারের মাধ্যমে Push Navigation সাধারণত একটি স্ট্যাক ভিত্তিক পদ্ধতি, যেখানে Modal Navigation ভিউ কন্ট্রোলারগুলোকে প্রেজেন্ট করে সরাসরি ব্যবহারকারীর স্ক্রিনে উপস্থাপন করা হয়। এই দুটি পদ্ধতির ব্যবহার এবং তাদের পার্থক্য নিচে বিস্তারিতভাবে আলোচনা করা হলো:
Push Navigation
Push Navigation UINavigationController ব্যবহার করে পরিচালিত হয় এবং এটি ভিউ কন্ট্রোলারগুলোর মধ্যে স্ট্যাক ভিত্তিক নেভিগেশন প্রদান করে।
Push Navigation এর বৈশিষ্ট্য:
- স্ট্যাক ভিত্তিক: UINavigationController একটি স্ট্যাক ব্যবহার করে ভিউ কন্ট্রোলারগুলোকে পুশ এবং পপ করে।
- ব্যাক নেভিগেশন সাপোর্ট: প্রতিটি নতুন ভিউ কন্ট্রোলার পুশ করলে UINavigationBar-এ একটি ব্যাক বোতাম দেখা যায়, যা ব্যবহারকারীকে পূর্বের ভিউতে ফেরত যেতে সাহায্য করে।
- হায়ারারক্যাল নেভিগেশন: এটি হায়ারারক্যাল তথ্য দেখানোর জন্য কার্যকরী। উদাহরণস্বরূপ, একটি মেইল অ্যাপে ইনবক্স থেকে একটি নির্দিষ্ট মেইলে যাওয়া।
Push Navigation ব্যবহার করার উদাহরণ:
let detailViewController = DetailViewController()
navigationController?.pushViewController(detailViewController, animated: true)
এই কোডের মাধ্যমে বর্তমান ভিউ কন্ট্রোলার থেকে DetailViewController পুশ করা হচ্ছে, যা UINavigationController-এর স্ট্যাকের শীর্ষে যোগ হবে।
Push Navigation এর ব্যবহার উপযুক্ত:
- হায়ারারক্যাল ডেটা প্রদর্শন করার জন্য যেমন তালিকা বা মেনু।
- ক্রমান্বয়ে এক ভিউ থেকে আরেক ভিউতে যাওয়ার জন্য।
- ব্যবহারকারীর ইন্টারঅ্যাকশনের উপর ভিত্তি করে ড্রিল-ডাউন নেভিগেশনের জন্য।
Modal Navigation
Modal Navigation হলো একটি পদ্ধতি যেখানে একটি ভিউ কন্ট্রোলার সরাসরি প্রেজেন্ট করা হয়, সাধারণত সম্পূর্ণ নতুন স্ক্রিন হিসেবে। এটি UINavigationController-এ নির্ভর করে না এবং একটি ভিন্ন কনটেক্সট তৈরি করতে ব্যবহৃত হয়, যেখানে ব্যবহারকারীকে একটি নির্দিষ্ট কাজ সম্পন্ন করতে বা কিছু তথ্য প্রদান করতে বলা হয়।
Modal Navigation এর বৈশিষ্ট্য:
- পুরোস্ক্রিন বা Sheet স্টাইল: Modal প্রেজেন্টেশনে ভিউ কন্ট্রোলার পুরো স্ক্রিন দখল করতে পারে বা শীট স্টাইলে অংশিকভাবে প্রদর্শিত হতে পারে।
- ডিসমিস (Dismiss) অপশন: ব্যবহারকারী সাধারণত একটি ক্রস বোতাম, "Done" বা "Cancel" বোতাম ট্যাপ করে Modal ভিউ ডিসমিস করতে পারে।
- টাস্ক ভিত্তিক: Modal ভিউ সাধারণত নির্দিষ্ট কাজ (যেমন, ফর্ম পূরণ করা, সেটিংস পরিবর্তন করা) বা কনটেক্সটের জন্য ব্যবহৃত হয়।
Modal Navigation ব্যবহার করার উদাহরণ:
let modalViewController = ModalViewController()
modalViewController.modalPresentationStyle = .fullScreen // বা .pageSheet
present(modalViewController, animated: true, completion: nil)
এই কোডের মাধ্যমে ModalViewController প্রেজেন্ট করা হচ্ছে যা পুরো স্ক্রিন বা শীট স্টাইলে প্রদর্শিত হবে।
Modal Presentation Styles:
Modal ভিউ কন্ট্রোলারগুলোতে বিভিন্ন প্রেজেন্টেশন স্টাইল রয়েছে:
- fullScreen: পুরো স্ক্রিন দখল করে।
- pageSheet: স্ক্রিনের মাঝামাঝি অংশ দখল করে, সাধারণত iPad বা বড় ডিভাইসে।
- formSheet: ফর্ম স্টাইলের মতো, সাধারণত ছোট ডিভাইসগুলোতে।
- currentContext: বর্তমান ভিউ কন্ট্রোলার প্রেজেন্ট করা হচ্ছে।
Modal Navigation এর ব্যবহার উপযুক্ত:
- নির্দিষ্ট টাস্ক যেমন ফর্ম পূরণ করা, সাইন ইন করা বা সেটিংস পরিবর্তন করা।
- একটি সম্পূর্ণ নতুন কনটেক্সট তৈরি করা যেখানে ব্যবহারকারীকে কিছু তথ্য ইনপুট দিতে হবে।
- ছোট কাজ সম্পন্ন করার জন্য, যেখানে হায়ারারক্যাল নেভিগেশনের প্রয়োজন নেই।
Push এবং Modal Navigation এর মধ্যে পার্থক্য:
| বৈশিষ্ট্য | Push Navigation | Modal Navigation |
|---|---|---|
| প্রেজেন্টেশন পদ্ধতি | UINavigationController এর মাধ্যমে স্ট্যাক ভিত্তিক | সরাসরি প্রেজেন্ট করা হয়, UINavigationController প্রয়োজন হয় না |
| ব্যাক নেভিগেশন | ডিফল্ট ব্যাক বোতাম প্রদান করে | ডিসমিস বাটন বা ক্রস বাটনের মাধ্যমে ডিসমিস করা হয় |
| ব্যবহার উপযুক্ত | হায়ারারক্যাল নেভিগেশন এবং ড্রিল-ডাউন নেভিগেশন | নির্দিষ্ট টাস্ক বা কনটেক্সট ভিত্তিক কাজ |
| প্রেজেন্টেশন স্টাইল | UINavigationController এর মাধ্যমে একটি নির্দিষ্ট শিরোনাম | পুরো স্ক্রিন, শীট বা ফর্ম স্টাইলের প্রেজেন্টেশন |
কখন কোনটি ব্যবহার করবেন?
- Push Navigation ব্যবহার করুন যখন আপনাকে হায়ারারক্যাল ডেটা বা ক্রমান্বয়ে একাধিক স্ক্রিন দেখাতে হবে।
- Modal Navigation ব্যবহার করুন যখন একটি নির্দিষ্ট কাজ (যেমন ফর্ম পূরণ করা বা সেটিংস পরিবর্তন করা) সম্পন্ন করতে হবে যা বর্তমান নেভিগেশন কন্টেক্সট থেকে আলাদা।
উদাহরণ: Push এবং Modal Navigation একসাথে ব্যবহার করা
class HomeViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .white
self.title = "Home"
// Push Navigation Button
let pushButton = UIButton(type: .system)
pushButton.setTitle("Go to Details", for: .normal)
pushButton.addTarget(self, action: #selector(pushToDetails), for: .touchUpInside)
pushButton.frame = CGRect(x: 50, y: 200, width: 300, height: 50)
view.addSubview(pushButton)
// Modal Navigation Button
let modalButton = UIButton(type: .system)
modalButton.setTitle("Open Modal", for: .normal)
modalButton.addTarget(self, action: #selector(presentModal), for: .touchUpInside)
modalButton.frame = CGRect(x: 50, y: 300, width: 300, height: 50)
view.addSubview(modalButton)
}
@objc func pushToDetails() {
let detailVC = DetailViewController()
navigationController?.pushViewController(detailVC, animated: true)
}
@objc func presentModal() {
let modalVC = ModalViewController()
modalVC.modalPresentationStyle = .fullScreen
present(modalVC, animated: true, completion: nil)
}
}
class DetailViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .lightGray
self.title = "Details"
}
}
class ModalViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .systemTeal
self.title = "Modal"
let dismissButton = UIButton(type: .system)
dismissButton.setTitle("Dismiss", for: .normal)
dismissButton.addTarget(self, action: #selector(dismissModal), for: .touchUpInside)
dismissButton.frame = CGRect(x: 50, y: 200, width: 300, height: 50)
view.addSubview(dismissButton)
}
@objc func dismissModal() {
dismiss(animated: true, completion: nil)
}
}
এই উদাহরণে, HomeViewController দুটি বোতাম ব্যবহার করে Push এবং Modal নেভিগেশনের জন্য দুটি আলাদা ভিউ কন্ট্রোলার ব্যবহার করে।
সারসংক্ষেপ:
- Push Navigation হায়ারারক্যাল নেভিগেশনের জন্য আদর্শ, যেখানে ভিউ কন্ট্রোলারগুলো ক্রমান্বয়ে পুশ এবং পপ করা হয়।
- Modal Navigation নির্দিষ্ট টাস্ক এবং আলাদা কনটেক্সটের জন্য ব্যবহার করা হয়, যেখানে নতুন স্ক্রিন পুরো স্ক্রিন বা শীট হিসেবে প্রেজেন্ট করা হয়।
Modal এবং Push Navigation সঠিকভাবে ব্যবহার করে iOS অ্যাপ্লিকেশনগুলোতে আরও ইন্টারেক্টিভ এবং প্রয়োজনীয় নেভিগেশন প্যাটার্ন তৈরি করা যায়।
Read more